[Eslint] Update arrow-parens to as-needed

README.md

@@ -1,4 +1,36 @@
-# janishutz Hyprland
+<div id="title" align="center">
+    <img src="https://static.janishutz.com/logo.jpg" width="300">
+    <h1>janishutz Hyprland</h1>
+</div>
+
+Collection of dotfiles for my personal Hyprland setup, running on Arch Linux. Includes a setup and install script (that one is not complete yet though). For my neovim config, see [here](https://git.janishutz.com/janishutz/nvim)
+
+## Features
+- Astal4 based Status Bar and Quick Actions menu
+    - System info
+    - Hyprland info
+    - Date & Time
+    - Bluetooth picker
+    - some networking settings (more coming later)
+    - Audio and brightness control
+    - battery monitoring
+    - Logout, Reboot, Shutdown, etc
+- Rofi config for App launcher
+- Wlogout config
+- Theming script that generates a GTK theme and theming for bar, Hyprland, etc
+- Fish config (with some handy aliases, based on one from ohh-my-fish)
+- Fastfetch config
+- kitty config with cursor trail
+- Linter configs (currently only eslint, which is not complete yet)
+- mpv config
+- zathura configs
+- yazi configs with links to various directories I use commonly plus a few plugins and themes that are applied by the script
+- Astal3 based Notifications (due to be migrated to Astal4)
+
+## Installing
+Clone your repo to any folder and adapt what you need. Some folders are still hard-coded, which I will be changing later on, so you will likely run into issues.
+
+You may then run the `setup` script. That won't install all dependencies though. The `install` script is what serves that purpose, but that is not complete yet
 
 
 ## Setting up to develop

build/helpers/render.js

@@ -30,7 +30,7 @@ const build = ( wallpaper, lockpaper, theme ) => {
             name: 'confirm-proceed-build',
             message: 'Okay to proceed with these colours?'
         } ] ).then( answer => {
-            if ( answer ) proceedWithBuild( wallpaper, lockpaper, theme, palette );
+            if ( answer['confirm-proceed-build'] ) proceedWithBuild( wallpaper, lockpaper, theme, palette );
             else {
                 // Have the user pick any other of the extracted colours instead
                 let counter = -1;

config/astal/components/QuickActions/modules/Player/Player.tsx

@@ -135,8 +135,9 @@ const PlayerItem = ({ player }: { player: AstalMpris.Player }) => {
 };
 
 const secondsToFriendlyTime = (time: number) => {
-    const minutes = Math.floor(time / 60);
+    const m = Math.floor(time / 60);
-    const hours = Math.floor(minutes / 60);
+    const minutes = Math.floor(m % 60);
+    const hours = Math.floor(m / 60 % 24);
     const seconds = Math.floor(time % 60);
     if (hours > 0) {
         return `${hours}:${expandTime(minutes)}:${expandTime(seconds)}`;

config/astal/util/colours.scss

@@ -1,5 +1,5 @@
 $fg-color: #E6E6E6;
 $bg-color: #141414;
-$accent-color: #591641;
+$accent-color: #645B47;
-$accent-color-2: #97103A;
+$accent-color-2: #593521;
 $shadow-color: rgba(40, 40, 40, 0.3);

config/hypr/hyprland/colors.conf

@@ -4,10 +4,10 @@
 #          ╰────────────────────────────────────────────────╯
 # ────────────────────────────────────────────────────────────────────
 
-exec = swaybg -m fill -i /home/janis/NextCloud/Wallpapers/dark/colour-explosion.jpg
+exec = swaybg -m fill -i /home/janis/NextCloud/Wallpapers/games-books-films/doom-the-dark-ages/doom-the-dark-ages-logo.jpg
 
 general {
-    col.active_border = rgba(591641cc) rgba(97103acc) rgba(2d2057cc) 45deg
+    col.active_border = rgba(645b47cc) rgba(593521cc) rgba(1f120ccc) 45deg
     col.inactive_border = rgb(000000)
 }
 

config/hypr/hyprland/general.conf

@@ -13,10 +13,10 @@ exec-once = /usr/lib/polkit-gnome/polkit-gnome-authentication-agent-1
 exec-once = hypridle
 exec-once = nm-applet
 exec-once = nextcloud --background
-# exec-once = sleep 2 && bash -c "ags run -d ~/projects/active/dotfiles/config/astal/ --gtk4 >> ~/log 2>&1"
+exec-once = sleep 2 && bash -c "ags run -d ~/projects/active/dotfiles/config/astal/ --gtk4 >> /tmp/runner-log 2>&1"
-exec-once = sleep 2 && bash -c "ags run -d ~/projects/active/dotfiles/config/astal/ --gtk4"
+# exec-once = sleep 2 && bash -c "ags run -d ~/projects/active/dotfiles/config/astal/ --gtk4"
-# exec-once = bash -c "ags run -d ~/projects/active/dotfiles/config/ags/notifications/ >> ~/logn 2>&1"
+exec-once = bash -c "ags run -d ~/projects/active/dotfiles/config/ags/notifications/ >> /tmp/notifier-log 2>&1"
-exec-once = bash -c "ags run -d ~/projects/active/dotfiles/config/ags/notifications/"
+# exec-once = bash -c "ags run -d ~/projects/active/dotfiles/config/ags/notifications/"
 
 
 

config/hypr/hyprlock.conf

@@ -18,7 +18,7 @@ general {
 # └                                                ┘
 background {
     monitor = 
-    path = /home/janis/NextCloud/Wallpapers/dark/colour-splash.jpg # Or screenshot
+    path = /home/janis/NextCloud/Wallpapers/games-books-films/doom-the-dark-ages/doom-the-dark-ages-logo.jpg # Or screenshot
 
     blur_passes = 1
 }
@@ -33,7 +33,7 @@ input-field {
     dots_size = 0.33 # Scale of input-field height, 0.2 - 0.8
     dots_spacing = 0.15 # Scale of dots' absolute size, 0.0 - 1.0
     dots_center = false
-    outer_color = rgb(89, 22, 65)
+    outer_color = rgb(100, 91, 71)
     inner_color = rgb(200, 200, 200)
     font_color = rgb(10, 10, 10)
     fade_on_empty = true

config/lint/dump

@@ -0,0 +1,65 @@
+// @ts-check
+
+import eslint from '@eslint/js';
+import tseslint from 'typescript-eslint';
+import stylistic from '@stylistic/eslint-plugin';
+
+export default tseslint.config(
+    eslint.configs.recommended,
+    ...tseslint.configs.recommended,
+    {
+        'plugins': {
+            '@stylistic/js': stylistic,
+            '@stylistic/ts': stylistic,
+        },
+        'rules': {
+            // Formatting
+            '@stylistic/js/array-bracket-newline': [ 'error', { 'multiline': true, 'minItems': 4 } ],
+            '@stylistic/js/array-bracket-spacing': [ 'error', 'always' ],
+            '@stylistic/js/array-element-newline': [ 'error', { 'multiline': true, 'minItems': 4 } ],
+            '@stylistic/js/arrow-parens': [ 'error', 'always' ],
+            '@stylistic/js/arrow-spacing': [ 'error', { 'before': true, 'after': true } ],
+            '@stylistic/js/block-spacing': [ 'error', 'always' ],
+            '@stylistic/js/brace-style': [ 'error', '1tbs' ],
+            '@stylistic/js/comma-spacing': [ 'error', { 'before': false, 'after': true } ],
+            '@stylistic/js/comma-style': [ 'error', 'last' ],
+            '@stylistic/js/dot-location': [ 'error', 'property' ],
+            '@stylistic/js/eol-last': [ 'error', 'always' ],
+            '@stylistic/js/function-call-spacing': [ 'error', 'never' ],
+            '@stylistic/js/implicit-arrow-linebreak': [ 'error', 'beside' ],
+            '@stylistic/js/indent': [ 'error', 4 ],
+            '@stylistic/js/key-spacing': [ 'error', { 'beforeColon': false, 'afterColon': true } ],
+            '@stylistic/js/keyword-spacing': [ 'error', { 'before': true, 'after': true } ],
+            '@stylistic/js/lines-between-class-members': [ 'error', 'always' ],
+            '@stylistic/js/new-parens': [ 'error', 'always' ],
+            '@stylistic/js/no-extra-parens': [ 'error', 'all' ],
+            '@stylistic/js/no-extra-semi': 'error',
+            '@stylistic/js/no-floating-decimal': 'error',
+            '@stylistic/js/no-mixed-operators': 'error',
+            '@stylistic/js/no-mixed-spaces-and-tabs': 'error',
+            '@stylistic/js/no-multi-spaces': 'error',
+            '@stylistic/js/no-trailing-spaces': 'error',
+            '@stylistic/js/no-whitespace-before-property': 'error',
+            '@stylistic/js/object-curly-newline': [ 'error', { 'multiline': true, 'minProperties': 3 } ],
+            '@stylistic/js/object-curly-spacing': [ 'error', 'always' ],
+            '@stylistic/js/one-var-declaration-per-line': 'error',
+            '@stylistic/js/quote-props': [ 'error', 'always' ],
+            '@stylistic/js/quotes': [ 'error', 'single' ],
+            '@stylistic/js/rest-spread-spacing': [ 'error', 'never' ],
+            '@stylistic/js/semi': [ 'error', 'always' ],
+            '@stylistic/js/semi-spacing': [ 'error', { 'before': false, 'after': true } ],
+            '@stylistic/js/semi-style': [ 'error', 'last' ],
+            '@stylistic/js/space-before-blocks': [ 'error', 'always' ],
+            '@stylistic/js/space-before-function-paren': [ 'error', 'always' ],
+            '@stylistic/js/space-in-parens': [ 'error', 'always' ],
+            '@stylistic/js/space-infix-ops': [ 'error', { 'int32Hint': false } ],
+            '@stylistic/js/space-unary-ops': 'error',
+            '@stylistic/js/spaced-comment': [ 'error', 'always' ],
+            '@stylistic/js/switch-colon-spacing': 'error',
+            '@stylistic/js/template-curly-spacing': [ 'error', 'always' ],
+            '@stylistic/js/wrap-iife': [ 'error', 'inside' ],
+            '@stylistic/js/wrap-regex': 'error',
+            '@stylistic/ts/type-annotation-spacing': 'error',
+        }
+    }
+);

config/lint/eslint.config.mjs

@@ -1,65 +1,118 @@
-// @ts-check
+import vue from 'eslint-plugin-vue';
-
 import eslint from '@eslint/js';
-import tseslint from 'typescript-eslint';
+import typescript from '@typescript-eslint/eslint-plugin';
 import stylistic from '@stylistic/eslint-plugin';
+import tseslint from 'typescript-eslint';
 
-export default tseslint.config(
+const style = {
-    eslint.configs.recommended,
-    ...tseslint.configs.recommended,
-    {
     'plugins': {
+        '@stylistic': stylistic,
         '@stylistic/js': stylistic,
         '@stylistic/ts': stylistic,
     },
     'rules': {
         // Formatting
-            '@stylistic/js/array-bracket-newline': [ 'error', { 'multiline': true, 'minItems': 4 } ],
+        '@stylistic/array-bracket-newline': ['error', { 'multiline': true, 'minItems': 4 }],
-            '@stylistic/js/array-bracket-spacing': [ 'error', 'always' ],
+        '@stylistic/array-bracket-spacing': ['error', 'always'],
-            '@stylistic/js/array-element-newline': [ 'error', { 'multiline': true, 'minItems': 4 } ],
+        '@stylistic/array-element-newline': ['error', { 'multiline': true, 'minItems': 4 }],
-            '@stylistic/js/arrow-parens': [ 'error', 'always' ],
+        '@stylistic/arrow-parens': ['error', 'as-needed'],
-            '@stylistic/js/arrow-spacing': [ 'error', { 'before': true, 'after': true } ],
+        '@stylistic/arrow-spacing': ['error', { 'before': true, 'after': true }],
-            '@stylistic/js/block-spacing': [ 'error', 'always' ],
+        '@stylistic/block-spacing': ['error', 'always'],
-            '@stylistic/js/brace-style': [ 'error', '1tbs' ],
+        '@stylistic/brace-style': ['error', '1tbs'],
-            '@stylistic/js/comma-spacing': [ 'error', { 'before': false, 'after': true } ],
+        '@stylistic/comma-spacing': ['error', { 'before': false, 'after': true }],
-            '@stylistic/js/comma-style': [ 'error', 'last' ],
+        '@stylistic/comma-style': ['error', 'last'],
-            '@stylistic/js/dot-location': [ 'error', 'property' ],
+        '@stylistic/dot-location': ['error', 'property'],
-            '@stylistic/js/eol-last': [ 'error', 'always' ],
+        '@stylistic/eol-last': ['error', 'always'],
-            '@stylistic/js/function-call-spacing': [ 'error', 'never' ],
+        '@stylistic/function-call-spacing': ['error', 'never'],
-            '@stylistic/js/implicit-arrow-linebreak': [ 'error', 'beside' ],
+        '@stylistic/implicit-arrow-linebreak': ['error', 'beside'],
-            '@stylistic/js/indent': [ 'error', 4 ],
+        '@stylistic/indent': ['error', 4],
-            '@stylistic/js/key-spacing': [ 'error', { 'beforeColon': false, 'afterColon': true } ],
+        '@stylistic/key-spacing': ['error', { 'beforeColon': false, 'afterColon': true }],
-            '@stylistic/js/keyword-spacing': [ 'error', { 'before': true, 'after': true } ],
+        '@stylistic/keyword-spacing': ['error', { 'before': true, 'after': true }],
-            '@stylistic/js/lines-between-class-members': [ 'error', 'always' ],
+        '@stylistic/lines-between-class-members': ['error', 'always'],
-            '@stylistic/js/new-parens': [ 'error', 'always' ],
+        '@stylistic/new-parens': ['error', 'always'],
-            '@stylistic/js/no-extra-parens': [ 'error', 'all' ],
+        '@stylistic/no-extra-parens': ['error', 'all'],
-            '@stylistic/js/no-extra-semi': 'error',
+        '@stylistic/no-extra-semi': 'error',
-            '@stylistic/js/no-floating-decimal': 'error',
+        '@stylistic/no-floating-decimal': 'error',
-            '@stylistic/js/no-mixed-operators': 'error',
+        '@stylistic/no-mixed-operators': 'error',
-            '@stylistic/js/no-mixed-spaces-and-tabs': 'error',
+        '@stylistic/no-mixed-spaces-and-tabs': 'error',
-            '@stylistic/js/no-multi-spaces': 'error',
+        '@stylistic/no-multi-spaces': 'error',
-            '@stylistic/js/no-trailing-spaces': 'error',
+        '@stylistic/no-trailing-spaces': 'error',
-            '@stylistic/js/no-whitespace-before-property': 'error',
+        '@stylistic/no-whitespace-before-property': 'error',
-            '@stylistic/js/object-curly-newline': [ 'error', { 'multiline': true, 'minProperties': 3 } ],
+        '@stylistic/object-curly-newline': ['error', { 'multiline': true, 'minProperties': 3 }],
-            '@stylistic/js/object-curly-spacing': [ 'error', 'always' ],
+        '@stylistic/object-curly-spacing': ['error', 'always'],
-            '@stylistic/js/one-var-declaration-per-line': 'error',
+        '@stylistic/one-var-declaration-per-line': 'error',
-            '@stylistic/js/quote-props': [ 'error', 'always' ],
+        '@stylistic/quote-props': ['error', 'always'],
-            '@stylistic/js/quotes': [ 'error', 'single' ],
+        '@stylistic/quotes': ['error', 'single'],
-            '@stylistic/js/rest-spread-spacing': [ 'error', 'never' ],
+        '@stylistic/rest-spread-spacing': ['error', 'never'],
-            '@stylistic/js/semi': [ 'error', 'always' ],
+        '@stylistic/semi': ['error', 'always'],
-            '@stylistic/js/semi-spacing': [ 'error', { 'before': false, 'after': true } ],
+        '@stylistic/semi-spacing': ['error', { 'before': false, 'after': true }],
-            '@stylistic/js/semi-style': [ 'error', 'last' ],
+        '@stylistic/semi-style': ['error', 'last'],
-            '@stylistic/js/space-before-blocks': [ 'error', 'always' ],
+        '@stylistic/space-before-blocks': ['error', 'always'],
-            '@stylistic/js/space-before-function-paren': [ 'error', 'always' ],
+        '@stylistic/space-before-function-paren': ['error', 'always'],
-            '@stylistic/js/space-in-parens': [ 'error', 'always' ],
+        '@stylistic/space-in-parens': ['error', 'always'],
-            '@stylistic/js/space-infix-ops': [ 'error', { 'int32Hint': false } ],
+        '@stylistic/space-infix-ops': ['error', { 'int32Hint': false }],
-            '@stylistic/js/space-unary-ops': 'error',
+        '@stylistic/space-unary-ops': 'error',
-            '@stylistic/js/spaced-comment': [ 'error', 'always' ],
+        '@stylistic/spaced-comment': ['error', 'always'],
-            '@stylistic/js/switch-colon-spacing': 'error',
+        '@stylistic/switch-colon-spacing': 'error',
-            '@stylistic/js/template-curly-spacing': [ 'error', 'always' ],
+        '@stylistic/template-curly-spacing': ['error', 'always'],
-            '@stylistic/js/wrap-iife': [ 'error', 'inside' ],
+        '@stylistic/wrap-iife': ['error', 'inside'],
-            '@stylistic/js/wrap-regex': 'error',
+        '@stylistic/wrap-regex': 'error',
         '@stylistic/ts/type-annotation-spacing': 'error',
     }
 }
+
+/** @type {import('eslint').Linter.FlatConfig[]} */
+export default tseslint.config(
+    // Base JavaScript rules
+    eslint.configs.recommended,
+    ...tseslint.configs.recommended,
+    style,
+
+    // TypeScript support
+    // {
+    //     files: ['**/*.ts', '**/*.tsx'],
+    //     languageOptions: {
+    //         parser: parserTs,
+    //         parserOptions: {
+    //             ecmaVersion: 'latest',
+    //             sourceType: 'module',
+    //             project: './tsconfig.json',
+    //             ecmaFeatures: {
+    //                 jsx: true,
+    //             },
+    //         },
+    //     },
+    //     plugins: {
+    //         '@typescript-eslint': typescript,
+    //     },
+    //     rules: {
+    //         ...typescript.configs.recommended.rules,
+    //         ...style.rules,
+    //     },
+    // },
+
+    // Vue support (including TS and JSX inside SFCs)
+    {
+        files: ['**/*.vue'],
+        extends: [
+            'plugin: vue/recommended'
+        ],
+        plugins: {
+            'vue-eslint-parser': vue,
+            '@typescript-eslint': typescript,
+        },
+        rules: {
+            ...typescript.configs.recommended.rules,
+            ...style.rules,
+
+            // You can override any Vue or TS rules here
+            'vue/html-indent': ['error', 4],
+            'vue/html-comment-indent': ['error', 4],
+            'vue/script-indent': ['error', 4],
+            'vue/max-attributes-per-line': ['error', {
+                singleline: 3,
+                multiline: { max: 1, allowFirstLine: false },
+            }],
+        },
+    },
 );

config/rofi/style.rasi

@@ -2,9 +2,9 @@
     background: #141414;
     background-selected: #1E1E1E;
     foreground: #E6E6E6;
-    accent: #591641;
+    accent: #645B47;
-    accent-two: #97103A;
+    accent-two: #593521;
-    // border-color: #2D2057;
+    // border-color: #1F120C;
     inactive: #C8C8C8;
     spacing: 2;
     width: 30em;

config/wlogout/style.css

@@ -22,11 +22,11 @@ button {
 }
 
 button:hover {
-    background-color: rgba(151, 16, 58, 0.5);
+    background-color: rgba(89, 53, 33, 0.5);
 }
 
 button:focus {
-    background-color: rgb(151, 16, 58);
+    background-color: rgb(89, 53, 33);
     color: rgb(230, 230, 230);
 }
 

gtk-theme/dist/colours.css

@@ -40,40 +40,40 @@
 /*
  * ── Accent colour ────────────────────────────────────────────────────
 */
-@define-color accent #591641;
+@define-color accent #645B47;
-@define-color accent_rgba_05 rgba(89, 22, 65, 0.5);
+@define-color accent_rgba_05 rgba(100, 91, 71, 0.5);
-@define-color accent_rgba_03 rgba(89, 22, 65, 0.3);
+@define-color accent_rgba_03 rgba(100, 91, 71, 0.3);
-@define-color accent_rgba_02 rgba(89, 22, 65, 0.2);
+@define-color accent_rgba_02 rgba(100, 91, 71, 0.2);
-@define-color accent_rgba_015 rgba(89, 22, 65, 0.15);
+@define-color accent_rgba_015 rgba(100, 91, 71, 0.15);
-@define-color accent_rgba_011 rgba(89, 22, 65, 0.11);
+@define-color accent_rgba_011 rgba(100, 91, 71, 0.11);
-@define-color accent_rgba_007 rgba(89, 22, 65, 0.07);
+@define-color accent_rgba_007 rgba(100, 91, 71, 0.07);
 
 /*
  * ── Accent Gradient ──────────────────────────────────────────────────
 */
-@define-color accent_gradient_1 #390E2A;
+@define-color accent_gradient_1 #403A2D;
-@define-color accent_gradient_2 #2E0B21;
+@define-color accent_gradient_2 #332F24;
-@define-color accent_gradient_3 #24091B;
+@define-color accent_gradient_3 #29251D;
-@define-color accent_gradient_4 #1D0715;
+@define-color accent_gradient_4 #211E17;
-@define-color accent_gradient_5 #170611;
+@define-color accent_gradient_5 #1A1813;
-@define-color accent_gradient_inverse_1 #8B2266;
+@define-color accent_gradient_inverse_1 #9C8E6F;
-@define-color accent_gradient_inverse_2 #8B2266;
+@define-color accent_gradient_inverse_2 #9C8E6F;
-@define-color accent_gradient_inverse_3 #8B2266;
+@define-color accent_gradient_inverse_3 #9C8E6F;
 
 /*
  * ── Secondary accent colour ──────────────────────────────────────────
 */
-@define-color accent2 #97103A;
+@define-color accent2 #593521;
-@define-color accent2_rgba_05 rgba(151, 16, 58, 0.5);
+@define-color accent2_rgba_05 rgba(89, 53, 33, 0.5);
-@define-color accent2_rgba_03 rgba(151, 16, 58, 0.3);
+@define-color accent2_rgba_03 rgba(89, 53, 33, 0.3);
-@define-color accent2_rgba_02 rgba(151, 16, 58, 0.2);
+@define-color accent2_rgba_02 rgba(89, 53, 33, 0.2);
-@define-color accent2_rgba_015 rgba(151, 16, 58, 0.15);
+@define-color accent2_rgba_015 rgba(89, 53, 33, 0.15);
-@define-color accent2_rgba_01 rgba(151, 16, 58, 0.1);
+@define-color accent2_rgba_01 rgba(89, 53, 33, 0.1);
 
 /*
  * ── Tertiary accent colour ───────────────────────────────────────────
 */
-@define-color accent3 #2D2057;
+@define-color accent3 #1F120C;
 
 /*
  * ── Inactive Colour ──────────────────────────────────────────────────

install

@@ -31,7 +31,7 @@ yay -S neovim lua lua-language-server tree-sitter texlab stylua luarocks jdtls p
 yay -S librewolf-bin webcord-bin thunderbird rustdesk brave-bin
 
 # Utilities
-yay -S okular vlc nextcloud-client p7zip zip unzip gnome-keyring noto-fonts thunderbird pamixer pavucontrol light neofetch bashtop hugo sddm uxplay upower
+yay -S okular vlc nextcloud-client p7zip zip unzip gnome-keyring noto-fonts thunderbird pamixer pavucontrol light neofetch bashtop hugo sddm uxplay upower gdu
 
 # LaTeX
 yay -S texlive biber

scripts/setup-eslint

@@ -5,5 +5,5 @@ SCRIPT_DIR=$(dirname "$0")
 cp "$SCRIPT_DIR/../config/lint/eslint.config.mjs" .
 
 # TODO: Improve eslint config to include JSX and Vue configs too, read on website
-npm i --save-dev @eslint/js typescript-eslint @stylistic/eslint-plugin
+npm i --save-dev @eslint/js typescript-eslint @stylistic/eslint-plugin eslint-plugin-vue