Discover Page Optimization

Restructured the Discover page to prevent the entire page from
refreshing when selecting categories or updating settings

1. Component Separation
-Split the page into three main components:
-DiscoverHeader: Contains the title, settings button, and category navigation
-DiscoverContent: Contains the grid of articles with its own loading state
-PreferencesModal: Manages the settings modal with temporary state

2. Optimized Rendering
-Used React.memo for all components to prevent unnecessary re-renders
-Each component only receives the props it needs
-The header remains stable while only the content area updates

3. Improved Loading States

3.1. Added separate loading states:
-Initial loading for the first page load
-Content-only loading when changing categories or preferences
-Loading spinners now only appear in the content area when changing
categories

3.2. Better State Management
-Main state is managed in the parent component
-Modal uses temporary state that only updates the main state after saving
-Clear separation of concerns between components

These changes create a more polished user experience where the header
and sidebar remain stable while only the content area refreshes when
needed. The page now feels more responsive and app-like, rather than
having the entire page refresh on every interaction

src/routes/discover.ts

@@ -45,13 +45,6 @@ const getSearchQueriesForCategory = (category: string): { site: string, keyword:
       { site: 'kotaku.com', keyword: 'gaming' },
       { site: 'eurogamer.net', keyword: 'games' }
     ],
-    'Weather': [
-      { site: 'weather.com', keyword: 'forecast' },
-      { site: 'accuweather.com', keyword: 'weather' },
-      { site: 'wunderground.com', keyword: 'weather' },
-      { site: 'noaa.gov', keyword: 'weather' },
-      { site: 'weatherchannel.com', keyword: 'forecast' }
-    ],
     'Entertainment': [
       { site: 'variety.com', keyword: 'entertainment' },
       { site: 'hollywoodreporter.com', keyword: 'entertainment' },