dwindown/WooNooW
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
177 Commits 1 Branch 0 Tags
5a4e2bab06453309e84b1f312a6eedeaab636beb
Commit Graph

8 Commits

Author SHA1 Message Date
dwindown
5a4e2bab06 fix: Polish UI/UX across all modes 
## Issue 1: Submenu Hidden in WP-Admin Modes ✅

**Problem:** Tax and Customer submenus visible in standalone but hidden in wp-admin modes

**Root Cause:** Incorrect `top` positioning calculation
- Was: `top-[calc(7rem+32px)]` (112px + 32px = 144px)
- Should be: `top-16` (64px - header height)

**Fixed:**
- `DashboardSubmenuBar.tsx` - Updated positioning
- `SubmenuBar.tsx` - Updated positioning

**Result:** Submenus now visible in all modes ✅

---

## Issue 2: Inconsistent Title in Standalone ✅

**Problem:** Title should prioritize: Logo → Store Name → WooNooW

**Fixed:**
- `StandaloneAdmin.php` - Use `woonoow_store_name` option first
- Falls back to `blogname`, then "WooNooW"

---

## Issue 3: Dense Card Header on Mobile ✅

**Problem:** Card header with title, description, and button too cramped on mobile

**Solution:** Stack vertically on mobile, horizontal on desktop

**Fixed:**
- `SettingsCard.tsx` - Changed from `flex-row` to `flex-col sm:flex-row`
- Button now full width on mobile, auto on desktop

**Result:** Better mobile UX, readable spacing ✅

---

## Issue 4: Missing "Go to WP Admin" Link ✅

**Added:**
- New button in More page (wp-admin modes only)
- Positioned before Exit Fullscreen/Logout
- Uses `ExternalLink` icon
- Links to `/wp-admin/`

---

## Issue 5: Customer Settings 403 Error ⚠️

**Status:** Backend ready, needs testing
- `CustomerSettingsProvider.php` exists and is autoloaded
- REST endpoints registered in `StoreController.php`
- Permission callback uses `manage_woocommerce`

**Next:** Test endpoint directly to verify

---

## Issue 6: Dark Mode Logo Support ✅

**Added:**
- New field: `store_logo_dark`
- Stored in: `woonoow_store_logo_dark` option
- Added to `StoreSettingsProvider.php`:
  - `get_settings()` - Returns dark logo
  - `save_settings()` - Saves dark logo

**Frontend:** Ready for implementation (use `useTheme()` to switch)

---

## Issue 7: Consistent Dark Background ✅

**Problem:** Login and Dashboard use different dark backgrounds
- Login: `dark:from-gray-900 dark:to-gray-800` (pure gray)
- Dashboard: `--background: 222.2 84% 4.9%` (dark blue-gray)

**Solution:** Use design system variables consistently

**Fixed:**
- `Login.tsx` - Changed to `dark:from-background dark:to-background`
- Card background: `dark:bg-card` instead of `dark:bg-gray-800`

**Result:** Consistent dark mode across all screens ✅

---

## Summary

✅ **Fixed 6 issues:**
1. Submenu visibility in all modes
2. Standalone title logic
3. Mobile card header density
4. WP Admin link in More page
5. Dark mode logo backend support
6. Consistent dark background colors

⚠️ **Needs Testing:**
- Customer Settings 403 error (backend ready, verify endpoint)

**Files Modified:**
- `DashboardSubmenuBar.tsx`
- `SubmenuBar.tsx`
- `StandaloneAdmin.php`
- `SettingsCard.tsx`
- `More/index.tsx`
- `StoreSettingsProvider.php`
- `Login.tsx`

**All UI/UX polish complete!** 🎨
 2025-11-11 09:26:06 +07:00
dwindown
0e41d3ded5 fix: Login branding, submenu display, favicon standalone, notification strategy 
## 1. Apply Logo to Standalone Login Screen ✅

**Issue:** Login page shows "WooNooW" text instead of brand logo

**Fix:**
- Fetch branding from `/store/settings` API
- Display logo image if available
- Fallback to store name text
- Show tagline below logo
- Use store name in footer

**Result:**
```tsx
{branding.logo ? (
  <img src={branding.logo} alt={storeName} className="h-16" />
) : (
  <h1>{branding.storeName}</h1>
)}
{branding.tagline && <p>{branding.tagline}</p>}
```

---

## 2. Fix Submenu Display Issue ✅

**Issue:**
- Click Settings → redirects to Store Details ✓
- Settings submenu shows correctly ✓
- Click other settings pages → Dashboard submenu appears ✗

**Root Cause:** `useActiveSection` hook didn't recognize `/settings` path

**Fix:**
```tsx
// Special case: /settings should match settings section
if (pathname === '/settings' || pathname.startsWith('/settings/')) {
  const settingsNode = navTree.find(n => n.key === 'settings');
  if (settingsNode) return settingsNode;
}
```

**Result:** Settings submenu now displays correctly on all settings pages

---

## 3. Apply Favicon in Standalone ✅

**Issue:** Favicon not showing in standalone mode (/admin)

**Root Cause:** Standalone doesn't call `wp_head()`, so Branding class hooks don't run

**Fix:** Added favicon directly to StandaloneAdmin.php
```php
$icon = get_option('woonoow_store_icon', '');
if (!empty($icon)) {
    echo '<link rel="icon" href="' . esc_url($icon) . '">'
    echo '<link rel="apple-touch-icon" href="' . esc_url($icon) . '">'
}
```

**Also:** Changed title to use store name dynamically

---

## 4. Notification Settings Strategy ✅

**Your Concern:** "We should not be optimistic the notification media is only email"

**Agreed!** Created comprehensive strategy document: `NOTIFICATION_STRATEGY.md`

### Architecture:

**Core (WooNooW):**
- Notification events system
- Email channel (built-in)
- Addon integration framework
- Settings UI with addon slots

**Addons:**
- WhatsApp
- Telegram
- SMS
- Discord
- Slack
- Push notifications
- etc.

### Settings Structure:
```
Notifications
├── Events (What to notify)
│   ├── Order Placed
│   │   ├── ✓ Email (to admin)
│   │   ├── ✓ WhatsApp (to customer) [addon]
│   │   └── ✗ Telegram [addon]
│   └── Low Stock Alert
│
├── Channels (How to notify)
│   ├── Email (Built-in) ✓
│   ├── WhatsApp [Addon]
│   ├── Telegram [Addon]
│   └── SMS [Addon]
│
└── Templates
    ├── Email Templates
    └── Channel Templates [per addon]
```

### Integration Points:
```php
// Register channel
add_filter('woonoow_notification_channels', function($channels) {
    $channels['whatsapp'] = [
        'id' => 'whatsapp',
        'label' => 'WhatsApp',
        'icon' => 'message-circle',
    ];
    return $channels;
});

// Send notification
add_action('woonoow_notification_send_whatsapp', function($event, $data) {
    // Send WhatsApp message
}, 10, 2);
```

### Benefits:
- ✅ Extensible (any channel via addons)
- ✅ Flexible (multiple channels per event)
- ✅ No bloat (core = email only)
- ✅ Revenue opportunity (premium addons)
- ✅ Community friendly (free addons welcome)

---

## Summary

✅ Login screen shows brand logo + tagline
✅ Settings submenu displays correctly
✅ Favicon works in standalone mode
✅ Notification strategy documented (addon-based)

**Key Decision:** Notifications = Framework + Email core, everything else via addons

**Ready to implement notification system!**
 2025-11-10 23:44:18 +07:00
dwindown
8960ee1149 feat: Add WooCommerce store settings (currency, formatting) to standalone mode 2025-11-04 23:43:07 +07:00
dwindown
0fbe35f198 fix: Add WNW_API config to standalone mode for API compatibility 2025-11-04 23:37:38 +07:00
dwindown
8a0f2e581e fix: Trust PHP auth check, skip redundant REST API call 2025-11-04 23:28:03 +07:00
dwindown
e8e380231e fix: Login flow - remove reload, sync auth state reactively 2025-11-04 23:19:53 +07:00
dwindown
4e1eb22c8f fix: Use parse_request hook for /admin + Dashboard menu now active on Overview (root path) 2025-11-04 22:43:20 +07:00
dwindown
4f75a5b501 fix: Remove blur on mobile for all bars + add template_redirect solution (no .htaccess needed) 2025-11-04 22:31:36 +07:00