>codeshame
Score: 4.2 out of 10
4.2/10
verdict: could_be_worse

"Overly verbose Angular router config that screams for refactoring"

lang: JavaScript·77 lines
//your_submission
AngularAbomination.js
(function () {
  "use strict";

  angular.module("app.core").config(routerConfig);

  routerConfig.$inject = [
    "$stateProvider",
    "$urlRouterProvider",
    "$locationProvider",
  ];

  function routerConfig($stateProvider, $urlRouterProvider, $locationProvider) {
    // Desabilitar HTML5 mode (usar hashbang #!)
    $locationProvider.html5Mode(false);
    $locationProvider.hashPrefix("");

    // Rota padrão
    $urlRouterProvider.otherwise("/login");

    // Configurar rotas
    $stateProvider
      .state("login", {
        url: "/login",
        template: "<login-component></login-component>",
        data: {
          requiresAuth: false,
        },
      })
      .state("register", {
        url: "/register",
        template: "<register-component></register-component>",
        data: {
          requiresAuth: false,
        },
      })
      .state("overview", {
        url: "/overview",
        template:
          "<app-layout-component><overview></overview></app-layout-component>",
        data: {
          requiresAuth: true,
        },
      })
      .state("transactions", {
        url: "/transactions",
        template:
          "<app-layout-component><transactions-list></transactions-list></app-layout-component>",
        data: {
          requiresAuth: true,
        },
      })
      .state("budgets", {
        url: "/budgets",
        template:
          "<app-layout-component><budgets></budgets></app-layout-component>",
        data: {
          requiresAuth: true,
        },
      })
      .state("pots", {
        url: "/pots",
        template: "<app-layout-component><pots></pots></app-layout-component>",
        data: {
          requiresAuth: true,
        },
      })
      .state("recurring-bills", {
        url: "/recurring-bills",
        template:
          "<app-layout-component><recurring-bills></recurring-bills></app-layout-component>",
        data: {
          requiresAuth: true,
        },
      });
  }
})();
//detailed_analysis
?

Verbosity Overload

The original code is a perfect example of how to make a simple task look like a Herculean effort. All those repeated $stateProvider.state calls? Yeah, those can be refactored into a nice loop.
!

Magic Strings

What's with all the hardcoded URLs and state names? Don't you know that magic strings are the devil's playground? It's like the author wanted to make the code harder to maintain on purpose.
?

Lack of Comments

I mean, come on, not a single comment in the entire code? How are we supposed to understand the thought process behind this... thing? It's like the author expected everyone to be a mind reader.
//suggested_fix
AngularAbomination_fixed.js
+(function () {
+ 'use strict';
+
+ angular.module('app.core').config(routerConfig);
+
+ routerConfig.$inject = [
+ '$stateProvider',
+ '$urlRouterProvider',
+ '$locationProvider',
+ ];
+
+ function routerConfig($stateProvider, $urlRouterProvider, $locationProvider) {
+ $locationProvider.html5Mode(false);
+ $locationProvider.hashPrefix('');
+
+ const states = [
+ { name: 'login', url: '/login', template: '<login-component></login-component>', requiresAuth: false },
+ { name: 'register', url: '/register', template: '<register-component></register-component>', requiresAuth: false },
+ { name: 'overview', url: '/overview', template: '<app-layout-component><overview></overview></app-layout-component>', requiresAuth: true },
+ { name: 'transactions', url: '/transactions', template: '<app-layout-component><transactions-list></transactions-list></app-layout-component>', requiresAuth: true },
+ { name: 'budgets', url: '/budgets', template: '<app-layout-component><budgets></budgets></app-layout-component>', requiresAuth: true },
+ { name: 'pots', url: '/pots', template: '<app-layout-component><pots></pots></app-layout-component>', requiresAuth: true },
+ { name: 'recurring-bills', url: '/recurring-bills', template: '<app-layout-component><recurring-bills></recurring-bills></app-layout-component>', requiresAuth: true }
+ ];
+
+ states.forEach(state => {
+ $stateProvider.state(state.name, {
+ url: state.url,
+ template: state.template,
+ data: { requiresAuth: state.requiresAuth }
+ });
+ });
+
+ $urlRouterProvider.otherwise('/login');
+ }
+})();