NotFoundState

App

Not-found / empty record state with optional go-back action.

Preview

Page not found

The page you're looking for doesn't exist or has been moved.

Code

<%- include('modules/app/NotFoundState') %>

Preview

User not found

This user account doesn't exist or may have been deleted.

Back to users

Code

<%- include('modules/app/NotFoundState', {
  title:       'User not found',
  description: 'This user account doesn't exist or may have been deleted.',
  backHref:    '/users',
  backLabel:   'Back to users'
}) %>

<%
  var _title       = locals.title       || 'Page not found';
  var _description = locals.description || "The page you're looking for doesn't exist or has been moved.";
  var _goBackLabel = locals.goBackLabel || 'Go back';
  // Accept either a JS handler string OR a plain href via the same prop.
  var _onGoBack    = locals.onGoBack    || '';
  var _isHref      = _onGoBack && typeof _onGoBack === 'string' && (
    _onGoBack.charAt(0) === '/' ||
    _onGoBack.charAt(0) === '#' ||
    _onGoBack.indexOf('http://') === 0 ||
    _onGoBack.indexOf('https://') === 0 ||
    _onGoBack.indexOf('mailto:') === 0
  );
%>
<%# EmptyState parity: matches EmptyState.ejs class output %>

  
    
  
  <%= _title %>
  <% if (_description) { %>
  <%= _description %>
  <% } %>
  <% if (_onGoBack) { %>
  
    <%# Button variant="outline" size="sm" iconLeft={faArrowLeft} %>
    <% if (_isHref) { %>
    
      
      <%= _goBackLabel %>
    
    <% } else { %>
    
    <% } %>
  
  <% } %>

NotFoundState

Default

Page not found

With back link

User not found

<%= _title %>