I'm thinking of changing the file structure into a more flexible and convenient one, similar to React
Here's a small example, something like this
.config/ags/
├── components/ # Reusable components
│ ├── bar/ # Bar components
│ │ ├── left/
│ │ │ ├── WindowTitle.js
│ │ │ └── Workspaces.js
│ │ ├── center/
│ │ │ ├── Music.js
│ │ │ └── System.js
│ │ ├── right/
│ │ │ ├── Battery.js
│ │ │ ├── Network.js
│ │ │ └── Indicators.js
│ │ └── corners/
│ │ ├── TopLeft.js
│ │ └── TopRight.js
│ ├── dock/
│ │ ├── buttons/
│ │ │ ├── AppButton.js
│ │ │ ├── LauncherButton.js
│ │ │ └── PinButton.js
│ │ └── DockLayout.js
│ ├── overview/
│ │ ├── search/
│ │ │ ├── SearchBar.js
│ │ │ └── SearchResults.js
│ │ ├── workspace/
│ │ │ ├── Grid.js
│ │ │ └── Preview.js
│ │ └── OverviewLayout.js
│ └── shared/
│ ├── buttons/
│ │ ├── IconButton.js
│ │ └── TextButton.js
│ ├── indicators/
│ │ ├── Battery.js
│ │ └── Network.js
│ └── containers/
│ ├── Box.js
│ └── Stack.js
├── services/ # Services
│ ├── system/
│ │ ├── battery.js
│ │ ├── brightness.js
│ │ └── network.js
│ ├── audio/
│ │ ├── volume.js
│ │ └── player.js
│ ├── hyprland/
│ │ ├── workspaces.js
│ │ └── windows.js
│ └── notifications/
│ ├── notification.js
│ └── manager.js
├── utils/ # Utilities
│ ├── styles/
│ │ ├── colors.js
│ │ ├── constants.js
│ │ └── themes.js
│ ├── helpers/
│ │ ├── process.js
│ │ ├── files.js
│ │ └── math.js
│ └── widgets/
│ ├── creation.js
│ └── modification.js
├── config/ # Configurations
│ ├── components/
│ │ ├── bar.js
│ │ ├── dock.js
│ │ └── overview.js
│ └── settings/
│ ├── appearance.js
│ ├── behavior.js
│ └── keybinds.js
├── scss/ # Styles
│ ├── components/
│ │ ├── bar.scss
│ │ ├── dock.scss
│ │ └── overview.scss
I'm thinking of changing the file structure into a more flexible and convenient one, similar to React
Here's a small example, something like this