diff --git a/web/components/bio/editable-bio.tsx b/web/components/bio/editable-bio.tsx index c9f12127..60318880 100644 --- a/web/components/bio/editable-bio.tsx +++ b/web/components/bio/editable-bio.tsx @@ -8,6 +8,50 @@ import { Row } from 'web/components/layout/row' import { TextEditor, useTextEditor } from 'web/components/widgets/editor' import { updateProfile } from 'web/lib/api' import { track } from 'web/lib/service/analytics' +import React, {useState} from "react"; +import ReactMarkdown from "react-markdown"; +import Link from "next/link" + +const placeHolder = "Tell us about yourself — and what you're looking for!"; + +const tips = ` +Write a clear and engaging bio to help others understand who you are and the connections you seek. Include: +- Your core values, interests, and activities +- Connection goals (friendship, romantic, collaborative) and availability +- What makes you unique and what you care about +- Expectations, boundaries, and personality traits +- Optional: romantic preferences, lifestyle habits, and conversation starters +` + +export function BioTips() { + const [showMoreInfo, setShowMoreInfo] = useState(false) + + return ( +
+ + {showMoreInfo && ( +
+ {tips} + Read full tips for writing a high-quality bio +
+ )} +
+ ) +} export function EditableBio(props: { profile: Profile @@ -18,7 +62,7 @@ export function EditableBio(props: { const editor = useTextEditor({ max: MAX_DESCRIPTION_LENGTH, defaultValue: (profile.bio as JSONContent) ?? '', - placeholder: "Tell us about yourself — and what you're looking for!", + placeholder: placeHolder, }) const hideButtons = editor?.getText().length === 0 && !profile.bio @@ -37,6 +81,7 @@ export function EditableBio(props: { return ( + {!hideButtons && ( @@ -68,11 +113,12 @@ export function SignupBio(props: { const editor = useTextEditor({ max: MAX_DESCRIPTION_LENGTH, defaultValue: '', - placeholder: "Tell us about yourself — and what you're looking for!", + placeholder: placeHolder, }) return ( + { diff --git a/web/pages/tips-bio.tsx b/web/pages/tips-bio.tsx new file mode 100644 index 00000000..5aea3e02 --- /dev/null +++ b/web/pages/tips-bio.tsx @@ -0,0 +1,20 @@ +import React from 'react'; + +import fs from 'fs'; +import path from 'path'; +import MarkdownPage from "web/components/markdown"; + +const FILENAME = __filename.split('/').pop()?.split('.').shift(); + +export async function getStaticProps() { + const filePath = path.join(process.cwd(), 'public', 'md', FILENAME + '.md'); + const content = fs.readFileSync(filePath, 'utf8'); + return {props: {content}}; +} + +type Props = { content: string }; + +export default function Faq({content}: Props) { + if (!FILENAME) throw new Error('Could not determine filename'); + return +} diff --git a/web/public/md/tips-bio.md b/web/public/md/tips-bio.md new file mode 100644 index 00000000..0baed955 --- /dev/null +++ b/web/public/md/tips-bio.md @@ -0,0 +1,132 @@ +# How to Write a High-Quality Compass Bio + +A strong bio is the heart of Compass. It helps others understand who you are, what you care about, and the type of connections you seek. Use the sections below as a guide — include what feels meaningful, and feel free to expand or combine sections as needed. + +## 1. **Introduction** + +* Briefly introduce yourself: name/nickname, age, languages spoken, location, and general lifestyle. + +Example: + +_Hi, I’m Lily, a 28-year-old living in Paris. I speak English and French fluently, work in environmental research, and love exploring creative hobbies on weekends._ + +## 2. **Connection Goals** + +* Specify what types of connections you’re seeking: friendship, romantic, collaborative, or multiple. +* Include your **availability**, timezone, and how you prefer to communicate. + +Example: + +_I’m looking for deep, meaningful friendships and long-term collaborative projects. I’m in CET timezone and usually available evenings for calls or meetups._ + +## 3. **Core Values** + +* Share the principles that guide your life, decision-making, and relationships. +* Consider values like honesty, growth, emotional stability, ethical responsibility, or integrity. + +Example: + + - _Intellectual curiosity: I enjoy exploring new ideas and challenging my own assumptions._ + - _Emotional stability: I prioritize calm, constructive dialogue in conflict._ + - _Ethical responsibility: I aim to reduce suffering in the world through conscious choices._ + +## 4. **Interests and Activities** + +* Hobbies, intellectual pursuits, and preferred ways to spend time. +* Include specifics (books, movies, sports, creative projects, volunteer work). + +Example: + + - _Hiking, meditation, and yoga_ + - _Reading philosophy, neuroscience, and science fiction_ + - _Community volunteering: environmental cleanups_ + +## 5. **Personality and Thinking Style** + +* Include your thinking style, emotional tendencies, and results from evidence-based personality tests (e.g., Big 5, MBTI, enneagram). +* Optional: describe humor, creativity, ambition, organization, or typical reactions to stress. + +Example: + + - _Thinking style: analytical and reflective_ + - _Humor: playful sarcasm and witty observations_ + - _Personality: introverted, high conscientiousness_ + +## 6. **Lifestyle and Preferences** + +* Include practical habits and preferences: diet, sleep, exercise, living situation, work-life balance, and pets. +* You may also note subcultures, routines, or quirky habits that define your day-to-day life. + +Example: + + - _Mostly vegan_ + - _Early riser, morning exercise routine_ + - _Live in a small apartment, enjoy minimalism_ + +## 7. **Health and Self-Improvement** + +* Share relevant physical or mental health traits, triggers, therapy goals, or what you’re actively trying to improve. + +Example: + + - _Working on managing anxiety during high-stress situations_ + - _Physically active but recovering from a minor knee injury_ + +## 8. **Romantic Relationships (Optional)** + +* Only include if seeking romantic connections. + +* Examples of what to share: + + * Love languages (giving and receiving) + * Timeline for relationship goals + * Romantic orientation and preferences + * Family goals (children, pets) + * Work-life balance and financial habits + * Housing situation (renting vs. owning) + * Comfort with dating someone with kids + +Example: + + - _Romantic orientation: heterosexual_ + - _Love languages: quality time and words of affirmation_ + - _Prefer a monogamous relationship, ideally building a family in the next 5–10 years_ + +## 9. **Ideal Connections** + +* Describe the traits, values, or interests you’d like in the people you connect with. +* Include where alignment is essential vs. where diversity is welcomed. + +Example: + + _I value honesty, curiosity, and humor. I’m open to different career paths, but shared commitment to personal growth is important._ + +## 10. **Altruistic and Community Values** + +* Share causes or community efforts you care about. +* Examples: sustainability, social justice, volunteering, or charitable initiatives. + +Example: + + - _Active in local environmental and animal welfare projects_ + - _Support education access initiatives in developing countries_ + +## 11. **Conversation Starters** + +* Include questions, prompts, or topics you enjoy discussing. +* Helps people reach out naturally and start meaningful conversations. + +Example: + + - _What book changed the way you see the world?_ + - _Favorite thought experiment or philosophical puzzle?_ + - _How do you integrate mindfulness into your daily life?_ + +## **Tips for a Great Bio** + +* Be **authentic and specific**. Concrete examples are more memorable than general statements. +* Balance **depth and readability**: enough information to connect meaningfully without overwhelming. +* **Update periodically** as your interests, availability, or goals evolve. +* Respect privacy — share what you’re comfortable with, but don’t shy away from showing personality. + +[//]: # (*** Use **Markdown formatting**: headings, bullet points, and line breaks make your bio easy to scan.**)