chafan-dev / chafan-pwa Goto Github PK

问题如图，出现在此问题张震的回答下。

看上去像是 markdown 在渲染代码块时错误地渲染了代码块周围的 HTML 内容。

Currently replacing a with RouterLink without other changes are introducing many silent bugs. The root cause is that currently the component is not fully reactive w.r.t. the params.

API definitions: src/interfaces/index.ts

问题说明

https://cha.fan/invitation-links/

目前是当前窗口跳转的，但是该邀请码展示页面没有任何的回退按钮

解决方案

A. 跳转到新标签页
B. 弹出对话框动态生成
C. 添加回退按钮

https://github.com/chafan-dev/frontend/blob/0e010e2e5c6fcee908a9ef7348c2cd95beae4ce8/src/views/main/Security.vue#L55

https://github.com/chafan-dev/frontend/blob/master/src/components/Event.vue

例如：

这里的链接前面多了一个 / ，点击后访问到了 cha.fan/https://github.com/xxx ，最终会跳转到网站首页。

似乎是这里的问题： https://github.com/chafan-dev/chafan-frontend/blob/master/src/views/main/Submission.vue#L39

（应该是 SubmissionCard 里的 RouterLink 问题

v1 (deprecated): I used v-html and a very simple replace based translator -- which is fundamentally broken.

v2 (current): Now I try to reuse the vditor (as in SimpleEditor/SimpleViewer), but it is hard to cut down its features that are not wanted in a lightweight input box.

I can't find good open-source implementation of similar feature, so I tried the two approaches above. But apparently they are not ideal.

• First add an experimental flag (e.g. https://github.com/chafan-dev/chafan-frontend/blob/bfa8a7eea9eb254afefd16d83e031b3287679486/src/views/main/Dashboard.vue#L570) and use it to control whether the dark mode controller is visible to general user.
• Add controller to https://github.com/chafan-dev/chafan-frontend/blob/master/src/components/UIStyleControllers.vue
  • Define a flag similar to NARROW_FEED_UI_KEY and update it similarly to readNarrowUI and commitSetNarrowUI

只有首页能正常显示，其他页面都是 404

本地测试用户也无法创建圈子等

https://github.com/chafan-dev/chafan-frontend/blob/30972b1e931a3a65872af8c49ef5f2152759e435/src/views/main/Question.vue#L22

@lynzrand Currently, if you run on the latest codebase:

$ yarn run eslint src/components/NewInviteLinkBtn.vue
  0:0  error  Parsing error: "parserOptions.project" has been set for @typescript-eslint/parser.
The file does not match your project config: src/components/NewInviteLinkBtn.vue.
The extension for the file (.vue) is non-standard. You should add "parserOptions.extraFileExtensions" to your config

I tried to add the parserOptions.extraFileExtensions as suggested

diff --git a/.eslintrc.js b/.eslintrc.js
index e51111a..6e479af 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -27,6 +27,7 @@ module.exports = {
   parserOptions: {
     project: 'tsconfig.json',
     sourceType: 'module',
+    extraFileExtensions: ['.vue']
   },
   plugins: ['@typescript-eslint'],
   rules: {

but then rerun the same check will throw:

/Users/zhen/projects/apps/chafan-frontend/src/components/NewInviteLinkBtn.vue
  3:6  error  Parsing error: '>' expected

不知道现在的 project 哪里是最好的拓展 v-card CSS 属性的方法？

https://github.com/chafan-dev/chafan-frontend/blob/master/src/components/LightboxGroup.vue

太小的时候有问题 e.g. https://cha.fan/questions/3vrbUtcMsSheae3PQy7b

• https://github.com/chafan-dev/frontend/blob/master/src/components/SearchBox.vue
• https://github.com/chafan-dev/frontend/blob/master/src/components/UserSearch.vue
• https://github.com/chafan-dev/frontend/blob/master/src/components/TopicSearch.vue

为何之前直接用 JS？之前试图写过，不 work，估计和 watch 有关。

Existing code https://github.com/chafan-dev/chafan-frontend/blob/30972b1e931a3a65872af8c49ef5f2152759e435/src/home.ts#L12

上图中缺失的部分是「我」

问题说明：

目前存在有很多地方作为基底样式（<div> <v-sheet>）的地方使用 来布局。
这样会导致内部可能无法与整体布局对其，无法直接覆写 vuetify vCard 内部样式（会因为以上情况导致样式重复应用） #26

解决方案：

清理代码并用 <v-sheet> 来替换。

Currently this is handled by reading a localStorage flag set from CreateQuestionForm.vue/CreateSubmissionForm.vue.

https://github.com/chafan-dev/chafan-frontend/blob/b9ad782ec298adf74ec556bb7b19b986bfe08047/src/views/main/Question.vue#L574-L579

This might be confusing to user -- since we are reusing the same logic when user actively tried to update an existing question/submission.

Extending on top of https://github.com/chafan-dev/chafan-frontend/blob/master/e2e_tests/selenium_driver.js

We need to add this to CI one day as well.

如上图，目前创建列表在右边栏（或者 bottom sheet）里，放到左边对应 tab 的开始（在已有问题/分享列表前）也许更方便直观。

• 个人简介 personal_introduction 如何使其仅显示正好一行宽？
• ”有X个关注者“等属性是否可以简化成 Icon + 数字来缩减所占行数？

https://github.com/chafan-dev/frontend/blob/0e010e2e5c6fcee908a9ef7348c2cd95beae4ce8/src/components/SiteCard.vue#L39-L54

is_placed_at_site_top

Currently, most of the API use are wrapped inside dispatchCaptureApiError or dispatchCaptureApiErrorWithErrorHandler to handle the erroneous cases when the API server is timing out, failing, or returning non-200 responses.

• Some APIs uses might be missing this handler
• How to make this less ad-hoc? (e.g. making the error handling a decorator over each API e.g. https://github.com/chafan-dev/chafan-frontend/blob/30972b1e931a3a65872af8c49ef5f2152759e435/src/api.ts#L70)

目前的 vditor 是选用了多个现成的解决方案后的折中结果。但是 vditor 本身有很多行为无法定制（以至于现在我们用的是我改了代码的 fork），整体上的美观和方便程度和一流的编辑器/渲染器体验仍相差甚远（比较对象：知乎，medium，notion 等）。

但是无论做何改进，最重要的需要保持的特点是源格式为 Markdown-based。

目前默认头像是根据用户名等信息计算出来的，有的时候甚至为空，就是一个蓝方块。

https://github.com/chafan-dev/chafan-frontend/blob/852521e5bb1df47f48f9af3434ffa796571f13ff/src/components/Avatar.vue#L16

可以像 Github 一样生成随机头像，或者设计一个原创吉祥物.........

可以输出成单独的文件或者包含在某个页面里

问题说明：

目前有大量的组件代码重复，例如各种 <CardComponent>。

解决方案：

创建 base 组件来提供统一的布局/样式，然后供给其他组件应用。

样例：

<template>
  <v-card v-bind="$attrs">
    <slot />
  </v-card>
</template>

<script>
export default {
  name: "BaseCard"
};
</script>

#81

https://github.com/chafan-dev/chafan-frontend/blob/master/src/views/main/Main.vue#L460

当时不用可选链的话，会提示 typescript 类型可能为 null 无法链接到下一个 key，但是增加可选链之后链接就自动变为 undefined

Also need a help dialog for these

https://iconpark.bytedance.com

iconify

有一些按钮的图形不能很好地暗示功能，也许增加一些悬浮说明更好。

期望改进的例子：

• URL：https://cha.fan/questions/6xRhxdYABj6ctQzppCtw?title=%E4%B8%AD%E5%9B%BD%E7%94%9F%E8%82%B2%E7%8E%87%E7%9A%84%E6%8C%81%E7%BB%AD%E4%B8%8B%E9%99%8D%E6%98%AF%E5%A5%BD%E4%BA%8B%E8%BF%98%E6%98%AF%E5%9D%8F%E4%BA%8B%EF%BC%9F
• XPath：/html/body/div[1]/div/div[1]/div[2]/main/div/div/div/div[1]/div[6]/div/div/div[3]/div[1]/div/div[2]/span[1]/span[1]/svg

期望达到的效果：

• URL：https://cha.fan/questions/6xRhxdYABj6ctQzppCtw?title=%E4%B8%AD%E5%9B%BD%E7%94%9F%E8%82%B2%E7%8E%87%E7%9A%84%E6%8C%81%E7%BB%AD%E4%B8%8B%E9%99%8D%E6%98%AF%E5%A5%BD%E4%BA%8B%E8%BF%98%E6%98%AF%E5%9D%8F%E4%BA%8B%EF%BC%9F
• XPath：/html/body/div[1]/div/div[1]/div[2]/main/div/div/div/div[1]/div[7]/div/div/div[3]/div[1]/div/div[2]/div[2]/a/span/svg

Does it conflict with ESLint/TSLint?

This is what I tried:

https://github.com/chafan-dev/chafan-frontend/blob/13ef11bcd4b83dab429b12471d05faf74251c128/public/manifest.json#L19

Not really useful.

问题描述

在私密圈子的页面点击加入之后，数据不会自动刷新，仍然显示无权限查看

demo

https://cha.fan/sites/music

解决方案

自动刷新页面/数据

也可考虑将这个tab的内容布局重新设计

（思源黑体配的 Source Sans 不好看，要不要把英文字体换成 Inter
（Inter 可以考虑用可变字体减小大小，思源在 google fonts 上应该是可以按需加载的
（啊 两个应该都在 google fonts 上有，另外 google fonts 有一个国内可用的反代：fonts.loli.net

@lynzrand

目前大多数内容已经组件化，不过需要进一步抽象；还需要加入一个 persistent state 记录用户的主题偏好（类似 LangPicker）

For video content preview from well-knowns platforms

https://developers.google.com/speed/pagespeed/insights/?url=cha.fan&tab=mobile&hl=en

We need to know why and how to address the issue