css - remove sass and bootstrap as backend deps, move all scss to fro…

…ntend

Gemfile

@@ -58,12 +58,6 @@ gem 'rgeo-geojson'
 # Use Active Storage variants [https://guides.rubyonrails.org/active_storage_overview.html#transforming-images]
 # gem "image_processing", "~> 1.2"
 
-# gem 'dartsass-rails'
-# gem 'dartsass-rails', '~> 0.5.0'
-gem 'sassc-rails'
-gem 'bootstrap', '~> 5.3.2'
-
-
 # https://github.com/BrandonShar/inertia-rails-template/blob/main/Gemfile
 gem 'vite_rails'
 

Gemfile.lock

@@ -82,8 +82,6 @@ GEM
       activerecord (>= 3.2, < 8.0)
       rake (>= 10.4, < 14.0)
     ast (2.4.2)
-    autoprefixer-rails (10.4.16.0)
-      execjs (~> 2)
     awrence (1.2.1)
     base64 (0.2.0)
     better_errors (2.10.1)
@@ -97,9 +95,6 @@ GEM
       debug_inspector (>= 1.2.0)
     bootsnap (1.18.3)
       msgpack (~> 1.2)
-    bootstrap (5.3.3)
-      autoprefixer-rails (>= 9.1.0)
-      popper_js (>= 2.11.8, < 3)
     builder (3.2.4)
     capybara (3.40.0)
       addressable
@@ -132,7 +127,6 @@ GEM
     drb (2.2.1)
     dry-cli (1.0.0)
     erubi (1.12.0)
-    execjs (2.9.1)
     factory_bot (6.4.6)
       activesupport (>= 5.0.0)
     factory_bot_rails (6.4.3)
@@ -253,7 +247,6 @@ GEM
     parser (3.3.1.0)
       ast (~> 2.4.1)
       racc
-    popper_js (2.11.8)
     prism (0.29.0)
     pry (0.14.2)
       coderay (~> 1.1)
@@ -371,14 +364,6 @@ GEM
     rubyzip (2.3.2)
     safety_net_attestation (0.4.0)
       jwt (~> 2.0)
-    sassc (2.4.0)
-      ffi (~> 1.9)
-    sassc-rails (2.1.2)
-      railties (>= 4.0.0)
-      sassc (>= 2.0)
-      sprockets (> 3.0)
-      sprockets-rails
-      tilt
     scout_apm (5.3.8)
       parser
     selenium-webdriver (4.21.1)
@@ -428,7 +413,6 @@ GEM
       thor (>= 1.2.0)
       yard-sorbet
     thor (1.3.1)
-    tilt (2.3.0)
     timeout (0.4.1)
     tpm-key_attestation (0.12.0)
       bindata (~> 2.4)
@@ -494,7 +478,6 @@ DEPENDENCIES
   better_errors
   binding_of_caller
   bootsnap
-  bootstrap (~> 5.3.2)
   capybara
   concurrent-ruby
   debug
@@ -517,7 +500,6 @@ DEPENDENCIES
   rspec-rails (~> 6)
   rspec-sorbet
   rubocop
-  sassc-rails
   scout_apm
   selenium-webdriver
   shortener

app/assets/stylesheets/application.css

@@ -0,0 +1,15 @@
+/*
+ * This is a manifest file that'll be compiled into application.css, which will include all the files
+ * listed below.
+ *
+ * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
+ * vendor/assets/stylesheets directory can be referenced here using a relative path.
+ *
+ * You're free to add application-wide styles to this file and they'll appear at the bottom of the
+ * compiled file so the styles you add here take precedence over styles defined in any other CSS
+ * files in this directory. Styles in this file should be added after the last require_* statement.
+ * It is generally better to create a new file per style scope.
+ *
+ *= require_tree .
+ *= require_self
+ */

app/frontend/components/NoAuthLayout.tsx

@@ -6,7 +6,7 @@ const NoAuthLayout: React.FC<PropsWithChildren & { isBubbles?: boolean }> = ({ c
     return (
         <LoginBubbles title={""} isBubbles={isBubbles}>
             <div>
-                <div className="row pb-2">
+                <div className="row pb-2 mt-5 pt-5">
                     <div className="col text-center">
                         <SwayLogo />
                     </div>

app/frontend/entrypoints/application.tsx

@@ -15,12 +15,7 @@ import { Toaster } from "react-hot-toast";
 import { Provider } from "react-redux";
 import { logDev } from "../sway_utils";
 
-// const RECAPTCHA__SCRIPT_PROPS = {
-//     async: true, // optional, default to false,
-//     defer: false, // optional, default to false
-//     appendTo: "head", // optional, default to "head", can be "head" or "body",
-//     nonce: undefined, // optional, default undefined
-// } as const;
+import "app/frontend/styles";
 
 const NO_AUTH_LAYOUTS = ["home", "registration"];
 
@@ -61,19 +56,12 @@ document.addEventListener("DOMContentLoaded", () => {
             Sentry.then(({ ErrorBoundary }) => {
                 createRoot(el!).render(
                     <ErrorBoundary onError={onRenderError} fallback={<RenderErrorHandler />}>
-                        {/* <GoogleReCaptchaProvider
-                            reCaptchaKey={import.meta.env.VITE_GOOGLE_RECAPTCHA_SITE_KEY}
-                            language="en"
-                            useEnterprise={true}
-                            scriptProps={RECAPTCHA__SCRIPT_PROPS}
-                        > */}
                         <StrictMode>
                             <Provider store={store(props.initialPage.props)}>
                                 <App {...props} />
                                 <Toaster />
                             </Provider>
                         </StrictMode>
-                        {/* </GoogleReCaptchaProvider> */}
                     </ErrorBoundary>,
                 );
             });

app/frontend/styles/index.ts

@@ -0,0 +1 @@
+import "./application.scss";

app/views/layouts/application.html.erb

@@ -4,11 +4,9 @@
     <title>Sway</title>
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <link rel="manifest" href="manifest.json" />
+
     <%= csrf_meta_tags %>
     <%= csp_meta_tag %>
-    
-    <%= stylesheet_link_tag "application", "data-turbo-track": "reload", nonce: true  %>
-    <%# <%= stylesheet_link_tag "scss/recaptcha", "data-turbo-track": "reload", nonce: true if @current_user  %>
 
     <%= vite_client_tag nonce: true  %>
     <%= vite_react_refresh_tag nonce: true  %>

config/environments/development.rb

@@ -82,11 +82,8 @@
 
   # https://dev.to/thomasvanholder/how-to-set-up-rails-hotwire-live-reload-38i9
   config.hotwire_livereload.listen_paths << Rails.root.join('app/assets/stylesheets')
-  config.hotwire_livereload.listen_paths << Rails.root.join('app/assets/stylesheets/scss')
-
   config.hotwire_livereload.listen_paths << Rails.root.join('app/controllers')
 
   config.hotwire_livereload.force_reload_paths << Rails.root.join('app/assets/stylesheets')
-  config.hotwire_livereload.force_reload_paths << Rails.root.join('app/assets/stylesheets/scss')
   config.hotwire_livereload.force_reload_paths << Rails.root.join('app/controllers')
 end

package.json

@@ -50,6 +50,7 @@
         "@types/react-dom": "^18.3.0",
         "@types/redux-logger": "^3.0.13",
         "@vitejs/plugin-react": "^4.3.0",
+        "dart-sass": "^1.25.0",
         "eslint": "^8.57.0",
         "eslint-import-resolver-typescript": "^3.6.1",
         "eslint-plugin-import": "^2.29.1",
@@ -64,6 +65,7 @@
         "react": "^18.3.1",
         "react-dom": "^18.3.1",
         "redux-logger": "^3.0.6",
+        "sass": "^1.77.6",
         "serve": "^14.2.3",
         "source-map-explorer": "^2.5.3",
         "typescript": "^5.4.5",