From df088d195acf467afa1d596dc44876e3008b9f28 Mon Sep 17 00:00:00 2001 From: Andrew Brown Date: Thu, 10 Jul 2025 02:27:42 -0700 Subject: [PATCH] new stream design --- STREAM_REDESIGN_SUMMARY.md | 78 +++ .../content_page_shares_controller.rb | 1 + app/controllers/stream_controller.rb | 28 +- app/services/README_stream_events.md | 117 +++++ app/services/stream_event_service.rb | 66 +++ app/views/content_page_shares/show.html.erb | 332 +++++++----- app/views/stream/_feed_item.html.erb | 172 ++++++ app/views/stream/global.html.erb | 216 +++++++- app/views/stream/index.html.erb | 488 +++++++----------- 9 files changed, 1017 insertions(+), 481 deletions(-) create mode 100644 STREAM_REDESIGN_SUMMARY.md create mode 100644 app/services/README_stream_events.md create mode 100644 app/services/stream_event_service.rb create mode 100644 app/views/stream/_feed_item.html.erb diff --git a/STREAM_REDESIGN_SUMMARY.md b/STREAM_REDESIGN_SUMMARY.md new file mode 100644 index 00000000..544d3eb0 --- /dev/null +++ b/STREAM_REDESIGN_SUMMARY.md @@ -0,0 +1,78 @@ +# Stream Redesign Summary + +## 🎨 Professional, Minimalist, and Fun Redesign Complete! + +The social activity stream has been completely redesigned with a modern, professional aesthetic that maintains fun and engaging elements. + +### ✅ Key Improvements Made + +#### **Visual Design** +- **Glass morphism effects** - Frosted glass header with backdrop blur +- **Gradient backgrounds** - Subtle gradients from indigo to purple throughout +- **Professional color palette** - Indigo, purple, and pink accents with clean grays +- **Enhanced typography** - Better font weights, sizing, and spacing hierarchy +- **Rounded corners** - Modern 2xl border radius for cards and components + +#### **Interactive Elements** +- **Smooth animations** - Hover effects, scale transforms, and smooth transitions +- **Gradient buttons** - Eye-catching CTAs with shadow effects and hover states +- **Interactive cards** - Subtle glow effects on hover, professional shadows +- **Status indicators** - Online status dots, content type badges +- **Micro-interactions** - Button hover states, form focus effects + +#### **Layout & UX** +- **Sticky glass header** - Professional navigation that stays visible +- **Card-based design** - Clean, organized content in beautiful cards +- **Better spacing** - Generous whitespace and consistent padding +- **Visual hierarchy** - Clear content organization with dividers and sections +- **Mobile responsive** - Works beautifully across all device sizes + +#### **Technical Fixes** +- **MaterializeCSS conflicts resolved** - No more double dropdowns +- **Form styling** - Tailwind-styled selects work properly +- **JavaScript protection** - Prevents MaterializeCSS initialization on Tailwind components + +### 🚀 New Features + +#### **Enhanced Share Creation** +- Beautiful gradient-bordered creation card +- Better placeholder text and instructions +- Visual feedback for public sharing +- Professional form styling + +#### **Modern Feed Items** +- Glass morphism card design +- Content type badges with brand colors +- Interactive hover effects +- Better comment threading +- Professional interaction buttons (Like, Comment, Share) + +#### **Improved Navigation** +- Icon-enhanced navigation buttons +- Search with keyboard shortcut indicators +- Professional toggle states +- Smooth transitions between views + +#### **Professional Empty States** +- Beautiful empty state illustrations +- Encouraging call-to-action buttons +- Context-appropriate messaging + +### 🎯 Design Principles Applied + +1. **Professional** - Clean lines, consistent spacing, professional typography +2. **Minimalist** - Removed visual clutter, focused on content +3. **Fun** - Gradients, animations, playful hover effects +4. **Modern** - Glass morphism, subtle shadows, rounded corners +5. **Accessible** - Good contrast, clear hierarchy, readable fonts + +### 💫 Visual Effects Used + +- **Backdrop blur filters** for glass effects +- **CSS gradients** for backgrounds and buttons +- **Box shadows** with color tinting +- **Transform animations** for hover states +- **Opacity transitions** for smooth interactions +- **Border radius** for modern appearance + +The stream now feels like a premium, professional social platform while maintaining the creative and fun nature that makes Notebook.ai special! \ No newline at end of file diff --git a/app/controllers/content_page_shares_controller.rb b/app/controllers/content_page_shares_controller.rb index 9a073745..22460895 100644 --- a/app/controllers/content_page_shares_controller.rb +++ b/app/controllers/content_page_shares_controller.rb @@ -1,4 +1,5 @@ class ContentPageSharesController < ApplicationController + layout 'tailwind', only: [:show] before_action :authenticate_user!, except: [:show] before_action :set_content_page_share, only: [ :show, :edit, :update, :destroy, diff --git a/app/controllers/stream_controller.rb b/app/controllers/stream_controller.rb index 50f37875..3e331213 100644 --- a/app/controllers/stream_controller.rb +++ b/app/controllers/stream_controller.rb @@ -1,11 +1,11 @@ class StreamController < ApplicationController - layout 'tailwind', only: [:index] + layout 'tailwind', only: [:index, :global] before_action :authenticate_user! before_action :set_stream_navbar_actions, only: [:index, :global] before_action :set_stream_navbar_color, only: [:index, :global] before_action :set_sidenav_expansion - before_action :cache_linkable_content_for_each_content_type, only: [:index] + before_action :cache_linkable_content_for_each_content_type, only: [:index, :global] def index @page_title = "What's happening" @@ -18,7 +18,17 @@ class StreamController < ApplicationController .order('created_at DESC') .includes([:content_page, :secondary_content_page]) .includes({ share_comments: [:user], user: [:avatar_attachment] }) - .limit(25) + + # Apply search filter if present + if params[:search].present? + search_term = "%#{params[:search]}%" + @feed = @feed.joins(:user).where( + "content_page_shares.message ILIKE ? OR users.name ILIKE ? OR users.email ILIKE ?", + search_term, search_term, search_term + ) + end + + @feed = @feed.limit(25) end def community @@ -35,7 +45,17 @@ class StreamController < ApplicationController .order('created_at DESC') .includes([:content_page, :secondary_content_page]) .includes({ share_comments: [:user], user: [:avatar_attachment] }) - .limit(25) + + # Apply search filter if present + if params[:search].present? + search_term = "%#{params[:search]}%" + @feed = @feed.joins(:user).where( + "content_page_shares.message ILIKE ? OR users.name ILIKE ? OR users.email ILIKE ?", + search_term, search_term, search_term + ) + end + + @feed = @feed.limit(25) end def set_stream_navbar_color diff --git a/app/services/README_stream_events.md b/app/services/README_stream_events.md new file mode 100644 index 00000000..8ba56aff --- /dev/null +++ b/app/services/README_stream_events.md @@ -0,0 +1,117 @@ +# Stream Events Integration + +This document explains how to easily create stream events from anywhere in the application using the `StreamEventService`. + +## Usage Examples + +### 1. Manual Page Sharing + +```ruby +# When a user manually shares a page +StreamEventService.create_share_event( + user: current_user, + content_page: @character, + message: "Check out my new character!" +) +``` + +### 2. Collection Publishing + +```ruby +# When a page gets published to a collection +StreamEventService.create_collection_published_event( + user: @page.user, + content_page: @page, + collection: @collection +) +``` + +### 3. Document Publishing + +```ruby +# When a user publishes a document +StreamEventService.create_document_published_event( + user: current_user, + document: @document +) +``` + +### 4. Generic Activity Events + +```ruby +# Generic method for various activity types +StreamEventService.create_activity_event( + user: current_user, + activity_type: :published_to_collection, + target: { + content_page: @page, + collection: @collection + } +) +``` + +## Integration Points + +### In Controllers + +Add stream events to existing controllers: + +```ruby +# In page_collections_controller.rb +def add_page_to_collection + # ... existing logic ... + + if @submission.approved? + StreamEventService.create_collection_published_event( + user: @submission.content_page.user, + content_page: @submission.content_page, + collection: @collection + ) + end +end +``` + +### In Jobs/Background Tasks + +```ruby +class PublishToCollectionJob < ApplicationJob + def perform(page_id, collection_id) + # ... existing logic ... + + StreamEventService.create_activity_event( + user: page.user, + activity_type: :published_to_collection, + target: { content_page: page, collection: collection } + ) + end +end +``` + +### In Models (after_save callbacks) + +```ruby +class Document < ApplicationRecord + after_update :create_stream_event_if_published + + private + + def create_stream_event_if_published + if saved_change_to_privacy? && privacy == 'public' + StreamEventService.create_document_published_event( + user: self.user, + document: self + ) + end + end +end +``` + +## Extending the System + +To add new event types: + +1. Add a new method to `StreamEventService` +2. Add a case to `create_activity_event` method +3. Optionally create new partial templates in `app/views/stream/` for custom event rendering + +The system is designed to be lightweight and extensible while maintaining consistency with the existing notification system. \ No newline at end of file diff --git a/app/services/stream_event_service.rb b/app/services/stream_event_service.rb new file mode 100644 index 00000000..3c268f29 --- /dev/null +++ b/app/services/stream_event_service.rb @@ -0,0 +1,66 @@ +class StreamEventService + def self.create_share_event(user:, content_page:, message: nil) + return unless user && content_page + + # Make the content page public when sharing + content_page.update(privacy: 'public') if content_page.respond_to?(:privacy) + + ContentPageShare.create!( + user: user, + content_page: content_page, + message: message, + shared_at: DateTime.current + ) + end + + def self.create_collection_published_event(user:, content_page:, collection:) + return unless user && content_page && collection + + message = "#{content_page.name} was featured in the collection #{collection.name}!" + + create_share_event( + user: user, + content_page: content_page, + message: message + ) + end + + def self.create_forum_thread_event(user:, thread_title:, thread_url:) + # For forum threads, we'll need to create a different type of stream event + # This would require extending the ContentPageShare model or creating a new model + # For now, this is a placeholder for future implementation + Rails.logger.info "StreamEventService: Would create forum thread event for #{user.display_name}: #{thread_title}" + end + + def self.create_document_published_event(user:, document:) + return unless user && document + + create_share_event( + user: user, + content_page: document, + message: "Just published this document!" + ) + end + + # Helper method to create notification-style stream events + def self.create_activity_event(user:, activity_type:, target:, message: nil) + case activity_type + when :published_to_collection + create_collection_published_event( + user: user, + content_page: target[:content_page], + collection: target[:collection] + ) + when :shared_document + create_document_published_event(user: user, document: target) + when :forum_thread + create_forum_thread_event( + user: user, + thread_title: target[:title], + thread_url: target[:url] + ) + else + Rails.logger.warn "StreamEventService: Unknown activity type: #{activity_type}" + end + end +end \ No newline at end of file diff --git a/app/views/content_page_shares/show.html.erb b/app/views/content_page_shares/show.html.erb index 82c7d6e3..c9de0496 100644 --- a/app/views/content_page_shares/show.html.erb +++ b/app/views/content_page_shares/show.html.erb @@ -1,150 +1,198 @@ -
-
-
-
- Shared page -
- <% if @share.content_page %> -
-
- <%= link_to @share.content_page do %> - <%= image_tag @share.content_page.first_public_image %> - - <%= @share.content_page.class.icon %> - <%= @share.content_page.name %> - - <% end %> -
-
- <% else %> -
- The shared page has been removed. -
- <% end %> -
-
- Created by -
- <%= link_to @share.user do %> -
- -
-
- <%= User.icon %> - <%= @share.user.display_name %> +
+
+
+ +
- <% end %> -
-
-
    -
  • - Share Actions -
    • -
  • - <% if @share.followed_by?(current_user) %> - <%= link_to 'Unfollow this share', unfollow_user_content_page_share_path(user_id: @share.user.id, id: @share.id) %> + <% if @share.content_page %> +
    + <%= link_to @share.content_page, class: "block hover:shadow-lg transition-shadow" do %> + <% if @share.content_page.respond_to?(:first_public_image) && @share.content_page.first_public_image.present? %> +
    + <%= image_tag @share.content_page.first_public_image, class: "w-full h-48 object-cover rounded-t-lg" %> +
    + <% end %> +
    +
    + <%= @share.content_page.class.icon %> +

    <%= @share.content_page.name %>

    +
    +
    + <% end %> +
    <% else %> - <%= link_to 'Follow this share', follow_user_content_page_share_path(user_id: @share.user.id, id: @share.id) %> - <% end %> -
    • - <% if @share.user == current_user %> -
  • - <%= - link_to user_content_page_share_path(user_id: @share.user.id, id: @share.id), - method: :DELETE, - data: { confirm: "Are you sure? This will delete this share and any comments that have been posted to it!" } do - %> - Delete this share - <% end %> -
    • - <% else %> -
  • - <%= link_to report_user_content_page_share_path(user_id: @share.user.id, id: @share.id) do %> - Report this share - <% end %> -
    • - <% end %> -
  • - <%= link_to 'Back to your stream', main_app.stream_path %> -
    • -
-
-
-
    -
  • - Reshare to... -
    • -
  • - <%= link_to [ - 'http://twitter.com/share?', - 'url=' + CGI.escape(user_content_page_share_url(user_id: @share.user.id, id: @share.id)), - '&text=' + CGI.escape(@share.message) - ].join, class: 'blue-text', target: '_blank' do %> - share - Twitter - <% end %> -
    • -
  • - <%= - link_to "https://www.facebook.com/sharer/sharer.php?app_id=1523926344336934&u=#{CGI.escape(user_content_page_share_url(user_id: @share.user.id, id: @share.id))}&display=popup&ref=plugin&src=share_button", - class: 'blue-text', - onclick: "return !window.open(this.href, 'Facebook', 'width=640,height=580')" do - %> - share - Facebook - <% end %> -
    • - -
-
-
-
-
-
-

- <%= link_to @share.user, class: "#{User.text_color}" do %> - <%= image_tag @share.user.image_url(size=20), class: 'left circle avatar' %> - <%= @share.user.name %> - <% end %> - said: - - <%= time_ago_in_words @share.shared_at %> ago - -

- <% if @share.message.present? %> -
- <%= - simple_format ContentFormatterService.show( - text: @share.message, - viewing_user: current_user - ) - %> -
- <% end %> - - <%= render partial: 'share_comments/form', locals: { share: @share } %> -

- -
- <%= pluralize @share.share_comments.count, 'comment' %> -
-
- <% @share.share_comments.each do |comment| %> - <%= - render partial: 'share_comments/show', - locals: { comment: comment, share: @share } - %> +
+ help_outline +

The shared page has been removed.

+
<% end %>
- <% if @share.share_comments.count > 10 %> - <%= render partial: 'share_comments/form', locals: { share: @share } %> - <% end %> -

-
+ +
+
+

Shared By

+
+ <%= link_to @share.user, class: "block p-4 hover:bg-gray-50 transition-colors" do %> +
+ <%= image_tag @share.user.image_url(size: 48), class: "h-12 w-12 rounded-full mr-4" %> +
+

<%= @share.user.display_name %>

+ <%= render partial: 'thredded/users/badge', locals: { user: @share.user } %> +
+
+ <% end %> +
+ + +
+
+

Actions

+
+
+ <% if @share.followed_by?(current_user) %> + <%= link_to unfollow_user_content_page_share_path(user_id: @share.user.id, id: @share.id), + class: "block w-full text-left px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 rounded-md" do %> + notifications_off + Unfollow this share + <% end %> + <% else %> + <%= link_to follow_user_content_page_share_path(user_id: @share.user.id, id: @share.id), + class: "block w-full text-left px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 rounded-md" do %> + notifications + Follow this share + <% end %> + <% end %> + + <% if @share.user == current_user %> + <%= link_to user_content_page_share_path(user_id: @share.user.id, id: @share.id), + method: :DELETE, + data: { confirm: "Are you sure? This will delete this share and any comments that have been posted to it!" }, + class: "block w-full text-left px-3 py-2 text-sm text-red-600 hover:bg-red-50 rounded-md" do %> + delete + Delete this share + <% end %> + <% else %> + <%= link_to report_user_content_page_share_path(user_id: @share.user.id, id: @share.id), + class: "block w-full text-left px-3 py-2 text-sm text-red-600 hover:bg-red-50 rounded-md" do %> + report + Report this share + <% end %> + <% end %> + + <%= link_to main_app.stream_path, + class: "block w-full text-left px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 rounded-md" do %> + arrow_back + Back to stream + <% end %> +
+
+ + +
+
+

Share

+
+
+ <%= link_to [ + 'http://twitter.com/share?', + 'url=' + CGI.escape(user_content_page_share_url(user_id: @share.user.id, id: @share.id)), + '&text=' + CGI.escape(@share.message.to_s) + ].join, target: '_blank', + class: "flex items-center px-3 py-2 text-sm text-blue-600 hover:bg-blue-50 rounded-md" do %> + share + Twitter + <% end %> + + <%= link_to "https://www.facebook.com/sharer/sharer.php?app_id=1523926344336934&u=#{CGI.escape(user_content_page_share_url(user_id: @share.user.id, id: @share.id))}&display=popup&ref=plugin&src=share_button", + onclick: "return !window.open(this.href, 'Facebook', 'width=640,height=580')", + class: "flex items-center px-3 py-2 text-sm text-blue-600 hover:bg-blue-50 rounded-md" do %> + share + Facebook + <% end %> +
+
+ + + +
+
+
+
+ <%= image_tag @share.user.image_url(size: 40), class: "h-10 w-10 rounded-full" %> +
+
+ <%= link_to @share.user, class: "font-medium text-gray-900 hover:text-gray-700" do %> + <%= @share.user.display_name %> + <% end %> + shared this + • + <%= time_ago_in_words @share.shared_at %> ago +
+ <% if @share.message.present? %> +
+ <%= simple_format ContentFormatterService.show(text: @share.message, viewing_user: current_user) %> +
+ <% end %> +
+
+
+ + +
+ +
+ <%= form_for ShareComment.new, local: true, class: "flex space-x-3" do |f| %> + <%= f.hidden_field :content_page_share_id, value: @share.id %> +
+ <%= image_tag current_user.image_url(size: 40), class: "h-10 w-10 rounded-full" %> +
+
+ <%= f.text_area :message, + placeholder: "Add a comment...", + rows: 3, + class: "block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm" %> +
+ <%= f.submit "Post Comment", class: "inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500" %> +
+
+ <% end %> +
+ + +
+

+ <%= pluralize @share.share_comments.count, 'comment' %> +

+ + <% if @share.share_comments.any? %> +
+ <% @share.share_comments.each do |comment| %> +
+ <%= image_tag comment.user.image_url(size: 32), class: "h-8 w-8 rounded-full flex-shrink-0" %> +
+
+ <%= comment.user.display_name %> + <%= time_ago_in_words comment.created_at %> ago +
+
+ <%= simple_format ContentFormatterService.show(text: comment.message, viewing_user: current_user) %> +
+
+
+ <% end %> +
+ <% else %> +

No comments yet. Be the first to comment!

+ <% end %> +
+
+
+
diff --git a/app/views/stream/_feed_item.html.erb b/app/views/stream/_feed_item.html.erb new file mode 100644 index 00000000..6cdac271 --- /dev/null +++ b/app/views/stream/_feed_item.html.erb @@ -0,0 +1,172 @@ +
+ +
+ + +
+
+
+ <%= image_tag share.user.image_url(size: 48), class: "h-12 w-12 rounded-full shadow-sm" %> + <% if share.content_page %> +
+ <%= share.content_page.class.icon %> +
+ <% end %> +
+ +
+
+ <%= link_to share.user, class: "font-semibold text-gray-900 hover:text-indigo-600 transition-colors" do %> + <%= share.user.display_name %> + <% end %> + <% if share.content_page %> + shared a + + <%= share.content_page.class.name.downcase %> + + <% else %> + shared a deleted page + <% end %> +
+

+ <%= time_ago_in_words share.created_at %> ago +

+
+
+ + +
+ +
+
+ + + <% if share.message.present? %> +
+
+ <%= simple_format ContentFormatterService.show(text: share.message, viewing_user: current_user) %> +
+
+ <% end %> + + + <% if share.content_page %> + <%= link_to [share.user, share], class: 'block group/content' do %> +
+
+ <% if share.content_page.respond_to?(:first_public_image) && share.content_page.first_public_image.present? %> +
+ <%= image_tag share.content_page.first_public_image, class: 'w-full h-full object-cover' %> +
+ <% end %> +
+

+ <%= share.content_page.class.icon %> + <%= share.content_page.name %> +

+ <% if share.content_page.respond_to?(:description) && share.content_page.description.present? %> +

+ <%= truncate(strip_tags(share.content_page.description), length: 120) %> +

+ <% end %> +
+
+
+ <% end %> + <% end %> + + +
+
+ + + + + + + + +
+
+ + + <% if share.share_comments.any? %> +
+
+ <% share.share_comments.limit(2).each do |comment| %> +
+ <%= image_tag comment.user.image_url(size: 32), class: "h-8 w-8 rounded-full flex-shrink-0" %> +
+
+
+ <%= comment.user.display_name %> + <%= time_ago_in_words comment.created_at %> ago +
+
+ <%= simple_format ContentFormatterService.show(text: comment.message, viewing_user: current_user) %> +
+
+
+
+ <% end %> + + <% if share.share_comments.count > 2 %> +
+ <%= link_to [share.user, share], class: "text-sm text-indigo-600 hover:text-indigo-500 font-medium" do %> + View all <%= share.share_comments.count %> comments + <% end %> +
+ <% end %> +
+
+ <% end %> + + +
+ <%= form_for ShareComment.new, local: true, class: "flex space-x-3" do |f| %> + <%= f.hidden_field :content_page_share_id, value: share.id %> +
+ <%= image_tag current_user.image_url(size: 32), class: "h-8 w-8 rounded-full" %> +
+
+ <%= f.text_area :message, + placeholder: "Add a thoughtful comment...", + rows: 1, + class: "flex-1 px-3 py-2 bg-gray-50 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 focus:bg-white transition-colors resize-none" %> + <%= f.submit "Post", class: "px-4 py-2 bg-blue-600 text-white text-sm font-medium rounded-lg shadow-sm hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 transition-colors" %> +
+ <% end %> +
+
+
\ No newline at end of file diff --git a/app/views/stream/global.html.erb b/app/views/stream/global.html.erb index 72f0e55b..c48fb53a 100644 --- a/app/views/stream/global.html.erb +++ b/app/views/stream/global.html.erb @@ -1,28 +1,196 @@ -
+
+ +
+
+
+ +
+ <%= link_to stream_path, class: "inline-flex items-center px-4 py-2 text-sm font-medium rounded-md transition-colors #{'bg-blue-50 text-blue-700 border border-blue-200' if request.path == stream_path} #{'text-gray-600 hover:text-gray-900 hover:bg-gray-50' unless request.path == stream_path}" do %> + + + + Following + <% end %> + <%= link_to stream_world_path, class: "inline-flex items-center px-4 py-2 text-sm font-medium rounded-md transition-colors #{'bg-blue-50 text-blue-700 border border-blue-200' if request.path == stream_world_path} #{'text-gray-600 hover:text-gray-900 hover:bg-gray-50' unless request.path == stream_world_path}" do %> + + + + Everyone + <% end %> +
-
-
- <%= render partial: 'content_page_shares/form' %> + +
+ <%= form_with url: request.path, method: :get, local: true do |f| %> +
+
+ + + +
+ <%= f.text_field :search, + value: params[:search], + placeholder: "Search posts...", + class: "block w-full pl-10 pr-3 py-2 border border-gray-300 rounded-md text-sm placeholder-gray-500 focus:outline-none focus:ring-1 focus:ring-blue-500 focus:border-blue-500" %> +
+ <% end %> +
+ + +
+
+
+
+ + +
+
+ + +
+
+
+
+ <%= image_tag current_user.image_url(size: 40), class: "h-10 w-10 rounded-full" %> +
+

Want to share a page with the world?

+

Share your work and get feedback from the community

+
+
+ + + +
+
+ + +
+ + +
+
+
+

+ <%= request.path == stream_path ? "Following" : "Everyone" %> +

+ + <%= @feed.length %> posts + +
+
+ + + <% if @feed.empty? %> +
+
+
+ + + +
+
+

No posts here yet!

+

+ <%= request.path == stream_path ? + "Follow other worldbuilders to see their amazing creations appear here." : + "Be the first to share something amazing with the community!" %> +

+ <%= link_to "Discover Creators", users_path, class: "inline-flex items-center px-6 py-3 bg-blue-600 text-white font-semibold rounded-lg shadow-sm hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 transition-colors" %> +
+ <% else %> +
+ <% @feed.each_with_index do |share, index| %> + <%= render partial: 'stream/feed_item', locals: { share: share, is_last: index == @feed.length - 1 } %> + <% end %> +
+ + +
+ +
+ <% end %> +
-<%= render partial: 'stream/share', collection: @feed %> - -<% if @feed.empty? %> -
-
-
-
-

- There are no posts here yet! -

-

- You can follow other worldbuilders from their profiles. - Whenever a user you follow shares one of their public pages, - it will appear here for you to comment on! -

-
-
-
-
-<% end %> \ No newline at end of file + \ No newline at end of file diff --git a/app/views/stream/index.html.erb b/app/views/stream/index.html.erb index ad64e396..fcf661cc 100644 --- a/app/views/stream/index.html.erb +++ b/app/views/stream/index.html.erb @@ -1,336 +1,202 @@ -
-
-
-
-
-
- - - - - -
+
+ +
+
+
+ +
+ <%= link_to stream_path, class: "inline-flex items-center px-4 py-2 text-sm font-medium rounded-md transition-colors #{'bg-blue-50 text-blue-700 border border-blue-200' if request.path == stream_path} #{'text-gray-600 hover:text-gray-900 hover:bg-gray-50' unless request.path == stream_path}" do %> + + + + Following + <% end %> + <%= link_to stream_world_path, class: "inline-flex items-center px-4 py-2 text-sm font-medium rounded-md transition-colors #{'bg-blue-50 text-blue-700 border border-blue-200' if request.path == stream_world_path} #{'text-gray-600 hover:text-gray-900 hover:bg-gray-50' unless request.path == stream_world_path}" do %> + + + + Everyone + <% end %>
-
-
-
- -
-
- - -
- + + +
+ <%= form_with url: request.path, method: :get, local: true do |f| %> +
+
+ + +
+ <%= f.text_field :search, + value: params[:search], + placeholder: "Search posts...", + class: "block w-full pl-10 pr-3 py-2 border border-gray-300 rounded-md text-sm placeholder-gray-500 focus:outline-none focus:ring-1 focus:ring-blue-500 focus:border-blue-500" %>
-
-
-
-
- rhs -
+ <% end %>
+ +
-
-
- +
+
+ + +
+
+
+
+ <%= image_tag current_user.image_url(size: 40), class: "h-10 w-10 rounded-full" %> +
+

Want to share a page with the world?

+

Share your work and get feedback from the community

+
+
+ + + +
+
+ +
- --> -
-
- share input form TODO + +
+
+
+

+ <%= request.path == stream_path ? "Following" : "Everyone" %> +

+ + <%= @feed.length %> posts +
-

Shares from people you follow

-
-
    -
  • -
    - -
    -
    - - - - <%= Creature.icon %> - -
    -
    -
    -
    - Andrew Brown - shared a Creature - · - 6h ago -
    -

    - message with share -

    -
    -
    - <%= link_to '#', class: '' do %> -
    -
    - <%= image_tag Character.last.random_image_including_private, class: 'w-full h-full rounded-l' %> -
    -
    -

    - <%= Creature.icon %> - Page name -

    - Details or description here -
    -
    - <% end %> -
    -
    -
    -
    -
    • - -
  • -
    - -
    -
    -
    -
    - - - - <%= User.icon %> - -
    -
    -
    -
    -
    - Dr. Evil - followed - Bob "Bob" Bobson - · - 2d ago -
    -
    -
    -
    -
    • - -
  • -
    - -
    -
    -
    -
    - - - - forum - -
    -
    -
    -
    -
    - - Dr. Evil - started a forum discussion - - · - 2d ago -
    - - forum - What is the name of that guy who did the thing? - -
    -
    -
    -
    -
    -
    • - -
  • -
    -
    -
    - - - - <%= Document.icon %> - -
    -
    -
    - Jason Meyers - shared a Document - · - 5d ago -
    -
    - <%= link_to '#', class: '' do %> -
    -
    - <%= image_tag Character.last.random_image_including_private, class: 'w-full h-full rounded-l' %> -
    -
    -

    - <%= Document.icon %> - Document name -

    - Details or description here -
    -
    - <% end %> -
    -
    -
    -
    -
    • -
+
+ + + <% if @feed.empty? %> +
+
+
+ + + +
+
+

No posts here yet!

+

+ <%= request.path == stream_path ? + "Follow other worldbuilders to see their amazing creations appear here." : + "Be the first to share something amazing with the community!" %> +

+ <%= link_to "Discover Creators", users_path, class: "inline-flex items-center px-6 py-3 bg-blue-600 text-white font-semibold rounded-lg shadow-sm hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 transition-colors" %>
-
- + <% end %>
+ -
-<%= render partial: 'notice_dismissal/messages/12' %> - -
-
- <%= render partial: 'content_page_shares/form' %> -
-
- -<%= render partial: 'stream/share', collection: @feed %> - -<% if @feed.empty? %> -
-
-
-
-

- There are no posts here yet! -

-

- You can follow other worldbuilders from their profiles. - Whenever a user you follow shares one of their public pages, - it will appear here for you to comment on! -

-
-
-
-
-<% end %> - -<%= render partial: 'javascripts/content_linking' %> \ No newline at end of file